//驾车点击改变颜色
import React, { Component } from 'react';
import {
    View,
    Text,
    TouchableOpacity,
} from 'react-native';


import { mapcarStyle as styles } from '../../../styles';

var Dimensions = require('Dimensions');
var width = Dimensions.get('window').width;
var height = Dimensions.get('window').height;


export default class Mapcolor extends Component {
    constructor(props) {
        super(props);
        this.state = { blue: 0 };
    };

    render() {
        return (
            <TouchableOpacity activeOpacity={1} onPress={() => { this.choose() }}>
                {this.props.selected ?
                    <View style={[styles.carevery2, { width: width * 0.3 }]}>
                        <Text style={[styles.caradvise2, { width: width * 0.295 }]}>线路{this.props.data.index+1}</Text>
                        <Text style={styles.cartime}>{(this.props.data.duration/60).toFixed(0)}分钟</Text>
                        <Text style={styles.carrange}>{(this.props.data.distance/1000).toFixed(1)}公里</Text>
                    </View> :
                    <View style={[styles.carevery, { width: width * 0.3 }]}>
                        <Text style={[styles.caradvise, { width: width * 0.295 }]}>线路{this.props.data.index+1}</Text>
                        <Text style={styles.cartime}>{(this.props.data.duration/60).toFixed(0)}分钟</Text>
                        <Text style={styles.carrange}>{(this.props.data.distance/1000).toFixed(1)}公里</Text>
                    </View>}
            </TouchableOpacity>
        )
    }
    choose() {
        this.props.callBack(this.props.data.index)
    }

}